Initial commitHEADmain

Created from https://vercel.com/new

1 files changed, 183 insertions, 0 deletions

diff --git a/src/app/(main)/websites/[websiteId]/WebsiteExpandedMenu.tsx b/src/app/(main)/websites/[websiteId]/WebsiteExpandedMenu.tsx
new file mode 100644
index 0000000..29c3954
--- /dev/null
+++ b/src/app/(main)/websites/[websiteId]/WebsiteExpandedMenu.tsx
@@ -0,0 +1,183 @@
+import { SideMenu } from '@/components/common/SideMenu';
+import { useMessages, useNavigation } from '@/components/hooks';
+import {
+  AppWindow,
+  Cpu,
+  Earth,
+  Globe,
+  Landmark,
+  Languages,
+  Laptop,
+  LogIn,
+  LogOut,
+  MapPin,
+  Megaphone,
+  Monitor,
+  Network,
+  Search,
+  Share2,
+  SquareSlash,
+  Tag,
+  Type,
+} from '@/components/icons';
+import { Lightning } from '@/components/svg';
+
+export function WebsiteExpandedMenu({
+  excludedIds = [],
+  onItemClick,
+}: {
+  excludedIds?: string[];
+  onItemClick?: () => void;
+}) {
+  const { formatMessage, labels } = useMessages();
+  const {
+    updateParams,
+    query: { view },
+  } = useNavigation();
+
+  const filterExcluded = (item: { id: string }) => !excludedIds.includes(item.id);
+
+  const items = [
+    {
+      label: 'URL',
+      items: [
+        {
+          id: 'path',
+          label: formatMessage(labels.path),
+          path: updateParams({ view: 'path' }),
+          icon: <SquareSlash />,
+        },
+        {
+          id: 'entry',
+          label: formatMessage(labels.entry),
+          path: updateParams({ view: 'entry' }),
+          icon: <LogIn />,
+        },
+        {
+          id: 'exit',
+          label: formatMessage(labels.exit),
+          path: updateParams({ view: 'exit' }),
+          icon: <LogOut />,
+        },
+        {
+          id: 'title',
+          label: formatMessage(labels.title),
+          path: updateParams({ view: 'title' }),
+          icon: <Type />,
+        },
+        {
+          id: 'query',
+          label: formatMessage(labels.query),
+          path: updateParams({ view: 'query' }),
+          icon: <Search />,
+        },
+      ].filter(filterExcluded),
+    },
+    {
+      label: formatMessage(labels.sources),
+      items: [
+        {
+          id: 'referrer',
+          label: formatMessage(labels.referrer),
+          path: updateParams({ view: 'referrer' }),
+          icon: <Share2 />,
+        },
+        {
+          id: 'channel',
+          label: formatMessage(labels.channel),
+          path: updateParams({ view: 'channel' }),
+          icon: <Megaphone />,
+        },
+        {
+          id: 'domain',
+          label: formatMessage(labels.domain),
+          path: updateParams({ view: 'domain' }),
+          icon: <Globe />,
+        },
+      ].filter(filterExcluded),
+    },
+    {
+      label: formatMessage(labels.location),
+      items: [
+        {
+          id: 'country',
+          label: formatMessage(labels.country),
+          path: updateParams({ view: 'country' }),
+          icon: <Earth />,
+        },
+        {
+          id: 'region',
+          label: formatMessage(labels.region),
+          path: updateParams({ view: 'region' }),
+          icon: <MapPin />,
+        },
+        {
+          id: 'city',
+          label: formatMessage(labels.city),
+          path: updateParams({ view: 'city' }),
+          icon: <Landmark />,
+        },
+      ].filter(filterExcluded),
+    },
+    {
+      label: formatMessage(labels.environment),
+      items: [
+        {
+          id: 'browser',
+          label: formatMessage(labels.browser),
+          path: updateParams({ view: 'browser' }),
+          icon: <AppWindow />,
+        },
+        {
+          id: 'os',
+          label: formatMessage(labels.os),
+          path: updateParams({ view: 'os' }),
+          icon: <Cpu />,
+        },
+        {
+          id: 'device',
+          label: formatMessage(labels.device),
+          path: updateParams({ view: 'device' }),
+          icon: <Laptop />,
+        },
+        {
+          id: 'language',
+          label: formatMessage(labels.language),
+          path: updateParams({ view: 'language' }),
+          icon: <Languages />,
+        },
+        {
+          id: 'screen',
+          label: formatMessage(labels.screen),
+          path: updateParams({ view: 'screen' }),
+          icon: <Monitor />,
+        },
+      ].filter(filterExcluded),
+    },
+    {
+      label: formatMessage(labels.other),
+      items: [
+        {
+          id: 'event',
+          label: formatMessage(labels.event),
+          path: updateParams({ view: 'event' }),
+          icon: <Lightning />,
+        },
+        {
+          id: 'hostname',
+          label: formatMessage(labels.hostname),
+          path: updateParams({ view: 'hostname' }),
+          icon: <Network />,
+        },
+        {
+          id: 'tag',
+          label: formatMessage(labels.tag),
+          path: updateParams({ view: 'tag' }),
+          icon: <Tag />,
+        },
+      ].filter(filterExcluded),
+    },
+  ];
+
+  return <SideMenu items={items} selectedKey={view} onItemClick={onItemClick} />;
+}